<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
  <title>百科</title>
  <link rel="icon" href="https://s1.ljcdn.com/clogin/favicon.ico">
  <link rel="stylesheet" href="./css/baike_hjx.css">
  <script src="./js/jquery.min.js"></script>
  <script src="./js/rem.js"></script>
</head>
<style>

</style>

<body>
  <div id="app">
    <header class="top">
      <div class="header-left">
        <!-- <span class="icon-back"> -->
        <img class="icon-back1" src="./img/icon.png" alt="" id="home">
        <!-- </span> -->
        <a href="javascript:void(0)" class="switch-city" id="city">合肥
          <img class="img" src="./img/icon2.png" alt="">
        </a>
      </div>
      <a href="" class="logo">
        <img class="img1" src="./img/logo.png" alt="">
      </a>
      <a href="" class="header-right">
        <i class="icon_user">
          <img class="img3" src="./img/people.png" alt="">
        </i>
      </a>
    </header>
    <!-- 下面内容 -->
    <div class="middle">
      <div class="beike">
        <i class="search-icon"></i>
        <div class="search">
          <input placeholder="房产知识有疑问？来搜索吧" type="text">
        </div>
      </div>
    </div>
    <!-- 中间内容 -->
    <div class="beike-home">
      <div class="top-sticky">
        <div class="lj-track">
          <div class="select-types">
            <div class="lj-track active">
              <span class="current-select select-span">
                二手房
              </span>
            </div>
            <div class="lj-track">
              <span class="current-select select-span">
                新房
              </span>
            </div>
            <div class="lj-track">
              <span class="current-select select-span">
                买房
              </span>
            </div>
            <div class="lj-track">
              <span class="current-select select-span">
                换房
              </span>
            </div>
            <div class="lj-track">
              <span class="current-select select-span">
                租房
              </span>
            </div>
            <a>
              <span class="more-root">
                <span>更多</span>
                <i class="more-icon"></i>
              </span>
            </a>
          </div>
          <!-- 准备买房 -->
          <div class="kandian-home__card class">
            <div class="lj-track inline-block">
              <div class="single-card" style="border: 1.5px solid rgb(234, 89, 81);overflow: visible;">
                <p class="card-name">准备买房</p>
                <p class="card-desc" style="background: rgb(234, 89, 81);">
                  <span>政策了解房屋定价</span>
                </p>
              </div>
            </div>
            <div class="lj-track inline-block">
              <div class="single-card">
                <p class="card-name">看房/选房</p>
                <p class="card-desc">
                  <span>如何找到心仪房子</span>
                </p>
              </div>
            </div>
            <div class="lj-track inline-block">
              <div class="single-card">
                <p class="card-name">签约/定房</p>
                <p class="card-desc">
                  <span>签合同注意事项</span>
                </p>
              </div>
            </div>
            <div class="lj-track inline-block">
              <div class="single-card">
                <p class="card-name">全款/贷款</p>
                <p class="card-desc">
                  <span>房产付款全面解析</span>
                </p>
              </div>
            </div>
            <div class="lj-track inline-block">
              <div class="single-card">
                <p class="card-name">缴税/过户</p>
                <p class="card-desc">
                  <span>最新流程及时了解</span>
                </p>
              </div>
            </div>
            <div class="lj-track inline-block">
              <div class="single-card">
                <p class="card-name">入住/交接</p>
                <p class="card-desc">
                  <span>注意事项风险提醒</span>
                </p>
              </div>
            </div>
            <div class="lj-track inline-block">
              <div class="single-card">
                <p class="card-name">买房风险</p>
                <p class="card-desc">
                  <span>保护权益减少违约</span>
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 标题 -->
    <div class="lj-track" id="ming">

    </div>
  </div>
  <script>

    var ul = document.getElementById("ming");
    function Txt(sendOne) {
      var xhr = new XMLHttpRequest();
      xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
          var data = JSON.parse(xhr.responseText);
          for (var i = 0; i < data.data.length; i++) {
            ul.innerHTML += `
                    <a class="baike-list-card active_one" href="">
                        <div class="left">
                            <div class="title">${data.data[i].title}</div>
                            <div class="desc_one">${data.data[i].content}</div>
                        </div>
                        <div class="right">
                            <img class="image" src="${data.data[i].img}" alt="">
                        </div>
                    </a>
                       `
          }
        }
      };
      xhr.open('get', 'http://118.31.73.169:3000/blist?name=' + sendOne);
      xhr.send();
    };
    Txt('twohouse')
  </script>
  <script>
    //返回
    $("#home").click(() => {
      window.location.href = "index_wzt.html"
    })
    // 城市改变
    $("#city").click(() => {
      window.location.href = "city_lcz.html"
    })
    if (sessionStorage.city) {
      $("#city").html(sessionStorage.city + "<img class='img' src='./img/icon2.png' alt=''>")
    } else {
      $("#city").html("合肥<img class='img' src='./img/icon2.png' alt=''>")
    }
  </script>
</body>

</html>